<template>
    <el-menu active-text-color="#ffd04b" background-color="#001525" class="AsidePage" default-active="/home/center"
             text-color="#fff" router>
        <el-menu-item index="/home/center">
            <el-icon>
                <Monitor/>
            </el-icon>
            <span>数据总览</span>
        </el-menu-item>
        <el-sub-menu index="1">
            <template #title>
                <el-icon>
                    <Setting/>
                </el-icon>
                <span>平台控制</span>
            </template>
            <el-menu-item index="/home/test">测试页面1</el-menu-item>
            <el-menu-item index="/test/test1/test2">分栏2</el-menu-item>
        </el-sub-menu>
        <el-sub-menu index="2">
            <template #title>
                <el-icon>
                    <FolderAdd/>
                </el-icon>
                <span>产品管理</span>
            </template>
            <el-menu-item index="/login">分栏1</el-menu-item>
            <el-menu-item index="/test/test1/test2">分栏2</el-menu-item>
        </el-sub-menu>
        <el-sub-menu index="3">
            <template #title>
                <el-icon>
                    <SwitchFilled/>
                </el-icon>
                <span>设备管理</span>
            </template>
            <el-menu-item index="/login">分栏1</el-menu-item>
            <el-menu-item index="/test/test1/test2">分栏2</el-menu-item>
        </el-sub-menu>
        <el-menu-item index="/registration">
            <el-icon>
                <Promotion/>
            </el-icon>
            <span>关于系统</span>
        </el-menu-item>
    </el-menu>
</template>

<script setup>
    import {FolderAdd, Monitor, Promotion, Setting, SwitchFilled} from "@element-plus/icons-vue";

</script>

<style scoped lang="less">
  .AsidePage {
    height: 100%;
  }
</style>
